/*---------------------flex--------------------------------*/
.flex-row {
  display: flex;
  align-items: center;
}

.flex-col {
  display: flex;
  flex-direction: column;
}

.space-between {
  justify-content: space-between;
}

.space-around {
  justify-content: space-around;
}

.align-center {
  align-items: center;
}

/*--------------------padding----------------------*/
.pd-1 {
  padding: 10px;
}

.pd-2 {
  padding: 20px;
}

/*-------------------margin-----------------------*/
.mr-0 {
  margin-right: 0;
}
.mr-1 {
  margin-right: 10px;
}
.mr-2 {
  margin-right: 20px;
}

.ml-0 {
  margin-left: 0;
}
.ml-1 {
  margin-left: 10px;
}
.ml-2 {
  margin-left: 20px;
}

.mt-0 {
  margin-top: 0;
}
.mt-1 {
  margin-top: 10px;
}
.mt-2 {
  margin-top: 20px;
}


.mb-0 {
  margin-top: 0;
}
.mb-1 {
  margin-top: 10px;
}
.mb-2 {
  margin-bottom: 20px;
}

/*-------------------width--------------------*/
.w-100 {
  width: 100%;
}

.h-100 {
  height: 100%;
}

/*----------position-----------*/
.pr {
  position: relative;
}
.pa {
  position: absolute;
}
.pf {
  position: fixed;
}

.ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}